import React, { Component } from 'react';
import { BPMNEditor } from '../../../components';
import { PrimaryC } from '../../../comps';

class Bpmn extends Component {
  // 右侧树形下拉配置
  data = {
    condition: [
      {
        // eslint-disable-next-line no-template-curly-in-string
        id: '${x===1}',
        name: '通过',
      },
      {
        id: '2',
        name: '不通过',
      },
    ],
    roles: [
      {
        id: 'ASMG',
        name: '资产管理专员',
      },
      {
        id: 'ICPR',
        name: '业务人员',
      },
    ],
    users: [
      {
        id: '01d34faef5a34f7986057b57e7418f17',
        name: '梓悦-资管',
      },
      {
        id: '11af0f0d9aa140bcb73b2a515277d67d',
        name: '韩少卯',
      },
    ],
    mode: [
      {
        id: '1',
        name: '抢占',
      },
      {
        id: '2',
        name: '并列',
      },
    ],
  };

  onSave = () => {
    this.state.BPMNEditor.handleSave((args) => {
      console.log('save', args);
    });
  };

  render() {
    return (
      <div>
        <PrimaryC title='保存' style={{ margin: '10px' }} onClick={this.onSave} />
        <div style={{ height: '300px' }}>
          <BPMNEditor
            attributeData={this.data}
            onRef={(ref) => this.setState({ BPMNEditor: ref })}
            // onClick={e=>console.log(e)}
            isOrder={true}
          />
        </div>
      </div>
    );
  }
}

export default Bpmn;
